<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>人员管理</title>

    <script src="../../plugs/jquery-3.1.1.min.js"></script>
    <link rel="stylesheet" href="../../assets/bootstrap/css/bootstrap.min.css">
    <script src="../../assets/bootstrap/js/bootstrap.min.js"></script>
    <!--富文本编辑器-->
    <link href="../../assets/summernote/summernote.css" rel="stylesheet">
    <script src="../../assets/summernote/summernote.js"></script>

    <!--本文校验-->
    <script src="https://cdn.bootcss.com/jquery-validate/1.15.1/additional-methods.min.js"></script>
    <script src="https://cdn.bootcss.com/jquery-validate/1.15.1/localization/messages_zh.min.js"></script>

    <!--jquery-ui-->
    <link href="https://cdn.bootcss.com/jqueryui/1.12.1/jquery-ui.css" rel="stylesheet">
    <script src="https://cdn.bootcss.com/jqueryui/1.12.1/jquery-ui.js"></script>
    <link rel="stylesheet" href="../../css/layer/mobile/need/layer.css">
    <script type="text/javascript" src="../../css/layer/layer.js"></script>
    <script>
        $(function() {
            $( ".datepicker" ).datepicker();
        });
    </script>

    <link rel="stylesheet" href="../css/platformManager.css">


</head>
<body>
<div class="container" style="margin-top:20px;width: 1200px">
<!--新建表单-->
<form class="form-horizontal" >
    <fieldset>

        <!-- Form Name -->
        <legend>新增用户</legend>

        <!-- Text input-->
       
        <!-- Text input-->
        <div class="control-group" >
<!--            <div class="controls" >-->
<!--                <label class="control-label" for="workerName">姓名</label>-->
<!--                <input id="workerName" name="workerName" type="text" class="input-xlarge" required="required">-->
<!--                <span class="help-block"></span>-->
<!--            </div>-->
            <div class="input-group">
                <span class="input-group-addon" id="sizing-addon1">姓名</span>
                <input style="width: 500px" id="workerName" name="workerName" type="text" class="form-control" placeholder="姓名...." aria-describedby="sizing-addon1">
            </div>
        </div>

        <!-- Text input-->
        <div class="control-group">
<!--            <div class="controls">-->
<!--                <label class="control-label" for="workerNum">账号</label>-->
<!--                <input id="workerNum" name="workerNum" type="text" placeholder="" class="input-xlarge" required="required">-->
<!--                <span class="help-block"></span>-->
<!--            </div>-->
            <div class="input-group">
                <span class="input-group-addon" id="sizing-addon2">账号</span>
                <input style="width: 500px" id="workerNum" name="workerNum" type="text" class="form-control" placeholder="账号...." aria-describedby="sizing-addon1">
            </div>
        </div>

        <!-- Text input-->
        <div class="control-group">
<!--            <div class="controls">-->
<!--                <label class="control-label" for="workerPwd">密码</label>-->
<!--                <input id="workerPwd" name="workerPwd" type="password" placeholder="" class="input-xlarge" required="required">-->
<!--                <span class="help-block"></span>-->
<!--            </div>-->
            <div class="input-group">
                <span class="input-group-addon" id="sizing-addon3">密码</span>
                <input style="width: 500px" id="workerPwd" name="workerPwd" type="password" class="form-control" placeholder="密码...." aria-describedby="sizing-addon1">
            </div>
        </div>

        <div class="control-group">
<!--            <div class="controls">-->
<!--                <label class="control-label" for="workerPwdAgain">确认密码</label>-->
<!--                <input id="workerPwdAgain" name="workerPwdAgain" type="password" placeholder="" class="input-xlarge" required="required">-->
<!--                <span class="help-block"></span>-->
<!--            </div>-->
            <div class="input-group">
                <span class="input-group-addon" id="sizing-addon4">确认密码</span>
                <input style="width: 500px" id="workerPwdAgain" name="workerPwdAgain" type="password" class="form-control" placeholder="确认密码...." aria-describedby="sizing-addon1">
            </div>
        </div>

        <!-- Text input-->
        <div class="control-group">
<!--            <div class="controls">-->
<!--                <label class="control-label" for="workerPhone">联系方式</label>-->
<!--                <input id="workerPhone" name="workerPhone" type="text" placeholder="" class="input-xlarge">-->
<!--                <span class="help-block"></span>-->
<!--            </div>-->
            <div class="input-group">
                <span class="input-group-addon" id="sizing-addon5">联系方式</span>
                <input style="width: 500px" id="workerPhone" name="workerPhone" type="text" class="form-control" placeholder="联系方式...." aria-describedby="sizing-addon1">
            </div>
        </div>
        
        
        <div class="control-group">
<!--            <div class="controls">-->
<!--                <label class="control-label" for="workerEmail">邮箱账号</label>-->
<!--                <input id="workerEmail" name="workerEmail" type="text" placeholder="" class="input-xlarge">-->
<!--                <span class="help-block"></span>-->
<!--            </div>-->
            <div class="input-group">
                <span class="input-group-addon" id="sizing-addon6">邮箱账号</span>
                <input style="width: 500px" id="workerEmail" name="workerEmail" type="text" class="form-control" placeholder="邮箱账号...." aria-describedby="sizing-addon1">
            </div>
        </div>

        <!-- Multiple Checkboxes (inline) -->
        <div class="control-group">
            <label class="control-label">角色</label>
            <div class="controls jscheckbox" id="role">
                <!--js动态添加-->

            </div>
        </div>


        <!-- Textarea -->
        

        <div class="control-group">
            <button type="button" id="submit" name="submit" class="btn btn-info">提交</button>
        </div>
    </fieldset>
</form>
</div>
</body>

<script>
$(document).ready(function(){
	//获取平台的生产模板信息
	$.ajax({
		type: "post",
		url: "../../system/getRoles.do",
		success: function(data)
		{
			fillrole(data);
		},
		error: function(status)
		{
            layer.msg(status,{icon: 5})
		}	
	});
	
	
	$('#workerPwdAgain').blur(function()
	{
		var workerPwd = $('#workerPwd').val();
		var workerPwdAgain = $('#workerPwdAgain').val();
		if(workerPwdAgain!=workerPwd)
		{
			$('#workerPwdAgain').parent().find('.help-block').text("密码不一致");
			$('#workerPwdAgain').parent().find('.help-block').css("color","red");
		}
		else
		{
			$('#workerPwdAgain').parent().find('.help-block').text("密码正确");
			$('#workerPwdAgain').parent().find('.help-block').css("color","green");
		}
	});
	
	function fillrole(data)
	{
		var len = data.list.length;
		//alert(len);
		for(var i=0;i<data.list.length;i++){
	    	var output="";
	        output+="<label class='radio inline' for='role-"+i+"'>"+
	        "<input type='radio' name='role' class='"+data.list[i].roleName+"' id='role' value='"+data.list[i].roleId+"'>"+
	        data.list[i].roleName+
	        "</input></label>";
	    	 $("#role").append(output);
    	}
	}
	//验证表单数据，获取表单内ring没处理数据，提交后台
	$('#submit').click(function()
	{
		var emailReg = /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;
		var businessId = $(window.parent.parent.frames["topFrame"].document).find('#businessId').text();
		//var businessId = $('#businessId').val();
		var workerName = $('#workerName').val();
		var workerNum = $('#workerNum').val();
		var workerPwd = $('#workerPwd').val();
		//验证邮箱是否存在
		var workerEmail = $('#workerEmail').val();
		//alert(workerPwd);
		var workerPhone = $('#workerPhone').val();
		//var roleDesc = $('#Comment').text();
		var roleId = $('#role').find('#role:checked').val();
		var roleName = $('#role').find('#role:checked').attr('class');
		
		
		if(businessId==""||workerName==""||workerNum==""||workerPwd==""||workerPhone==""||
				roleId==""||roleName=="")
		{
            layer.msg("表单信息不完整",{icon: 5})
		}else if (!emailReg.test(workerEmail)) {
            layer.msg("请输入正确的邮箱",{icon: 5})
		}else
		{
			$.ajax({
				type: 'post',
				url: '../addWorker.do',
				data: {
					//"businessId":businessId,
					"workerName":workerName,
					"workerNum":workerNum,
					"workerPwd":workerPwd,
					"workerPhone":workerPhone,				
					"roleId":roleId,
					"businessId":businessId,
					"roleName":roleName,
					"workerEmail":workerEmail
				},
				success: function(data,status)
				{
                    layer.msg("提交成功",{icon: 1})
				},
				error: function(status)
				{
                    layer.msg(status,{icon: 5})
				}
			});	
		}
	});	
	
});
</script>

</html>